.contacts {
    text-align: center;
    padding: 20px;
    color: white;
    background-color: #16145f;
}

/* Style pour le lien de courrier */
.mail-me a {
    color: white;
    font-size: 125%;
    text-decoration: none;
    position: relative;
    display: inline-block;
    overflow: hidden;
}

/* Style pour le pseudo-élément */
.mail-me a::before {
    content: "";
    position: absolute;
    width: 0; /* Commence avec une largeur nulle */
    height: 2px; /* Hauteur de la ligne de soulignement */
    bottom: 0;
    left: 0;
    background-color: #ff6600; /* Couleur de la ligne de soulignement */
    transition: width 0.3s ease; /* Transition de la largeur */
}

/* Animation au survol */
.mail-me a:hover::before {
    width: 100%; /* Augmentez la largeur de la ligne de*/
}